// 暴露出去一个实例化的 vue-router 的路由实例对象

// 引入 Vue 核心
import Vue from 'vue'

// 引入 vue-router 插件
import VueRouter from 'vue-router'

// 引入定义好的路由组件 views 文件中写的组件 @ => src
import Films from '@/views/Films'
import FilmsA from '@/views/FilmsA'
import FilmsB from '@/views/FilmsB'
import Cinemas from '@/views/Cinemas'

// 注册 vue-router 插件
Vue.use(VueRouter)

// 实例化 路由实例对象
const router = new VueRouter({
  // 配置选项

  // 路由规则集合
  routes: [
    // 一级路由，要渲染是找的 App.vue 中坑位
    {
      path: '/films',
      component: Films,
      children: [
        // /films 这个一级路由的 子级路由
        // 这里的组件如果要渲染出来，需要找对应的上级路由组件中提供的坑位
        {
          // !!! 除了一级路由需要以 / 开头，其它级别的路由不要写 /
          path: 'nowPlaying',
          component: FilmsA,
          // children: [
          //   // 三级路由
          // ]
        },
        {
          path: 'comingSoon',
          component: FilmsB
        }
      ]
    },
    {
      path: '/cinemas',
      component: Cinemas
    }
  ]
})

// 暴露
export default router